<template>
  <a-modal
    title="请选择导入数据来源"
    width="400px"
    :visible="visible"
    :confirm-loading="syncLoading"
    okText="确认选择"
    @ok="handlerSyncAllData"
    @cancel="handleCancel"
  >
    <a-form-model :model="form" :label-col="labelCol" :wrapper-col="wrapperCol">
      <!-- <a-form-model-item label="">
        <a-radio-group v-model="form.currentSelected">
          <a-radio :value="1" :disabled="!currentAreaName"
            >从指定区域本年耕补数据增量导入<span style="color: red"
              >({{
                currentAreaName
                  ? '当前选择地区' + currentAreaName
                  : '当前未选中行政地区无法选择该渠道'
              }})</span
            ></a-radio
          >
          <a-radio
            :value="2"
            v-if="
              (isSecondPlant || isThirdPlant) &&
              currentAuth('crop-member.import-first')
            "
            >从本年首次一次补导入</a-radio
          >
          <a-radio
            :value="3"
            v-if="isThirdPlant && currentAuth('crop-member.import-second')"
            >从本年第2次一次补导入</a-radio
          >
          <a-radio
            :value="4"
            v-if="isThirdPlant && currentAuth('crop-member.import-second')"
            >从下年耕补数据导入</a-radio
          >
        </a-radio-group>
      </a-form-model-item> -->
      <a-form-model-item label="年份">
        <a-select
          v-model="form.target_year"
          placeholder="请选择指定年份"
          @change="handlerChangeYear"
        >
          <a-select-option
            v-for="item in years"
            :value="item.label"
            :key="item.label"
            >{{ item.label }}</a-select-option
          >
        </a-select>
      </a-form-model-item>
      <a-form-model-item label="项目">
        <a-select v-model="form.target_task_id" placeholder="请选择指定项目">
          <a-select-option
            v-for="item in projects"
            :value="item.task_id"
            :key="item.task_id"
            >{{ item.task_nam }}</a-select-option
          >
        </a-select>
      </a-form-model-item>
    </a-form-model>
  </a-modal>
</template>

<script lang="ts">
import { Vue, Component, Prop } from 'vue-property-decorator'
import { userModule, PROJECT_IDS } from '@/store/modules/user'
import { cropMemberServices } from '@/common/services/crop-member'
import { IProject } from '@/common/services'

@Component
export default class SelectImport extends Vue {
  @Prop()
  public currentAreaName!: string
  @Prop()
  public currentAreaId!: string

  public visible = false

  public labelCol = { span: 4 }
  public wrapperCol = { span: 20 }

  public form = {
    currentSelected: 0,
    target_year: undefined,
    target_task_id: undefined,
  }

  public projects: IProject[] = []

  get years() {
    return userModule.years
  }

  get isSecondPlant() {
    return userModule.isSecondPlant
  }

  get isThirdPlant() {
    return userModule.isThirdPlant
  }

  public show() {
    console.log(this.years)
    this.visible = true
  }

  public handleOk() {
    if (!this.form.currentSelected) {
      this.$message.error('请选择导入的数据来源！')
      return
    }
    const labelMap: Record<number, string> = {
      1: '指定区域本年耕补数据增量导入',
      2: '本年首次一次补导入',
      3: '本年第2次一次补导入',
      4: '下年耕补数据导入',
    }
    this.$confirm({
      title: '提示',
      content: `您确认从${labelMap[this.form.currentSelected]}数据？`,
      onOk: () => {
        switch (this.form.currentSelected) {
          case 1:
            this.handlerSyncData()
            break
          case 2:
            this.handlerSyncFirstData(1)
            break
          case 3:
            this.handlerSyncFirstData(2)
            break
          case 4:
            this.handlerSyncData(true)
            break
        }
      },
    })
  }

  public handleCancel() {
    this.visible = false
  }

  public currentAuth(auth: string) {
    let auths: string[] = []
    if (Array.isArray(auth)) {
      auths = auth
    } else if (auth) {
      auths = [auth]
    }
    if (auths.length === 0) return true
    // @ts-ignore
    return this.$route?.meta.permission.find((item) =>
      auths.includes(item.value)
    )
  }

  // 同步上一年数据
  public syncLoading = false
  public handlerSyncData(next?: boolean) {
    const loading = this.$message.loading({
      content: '数据正在同步中。。。请稍后',
    })
    this.syncLoading = true
    cropMemberServices
      .syncThisYearData({
        s_a_id: this.currentAreaId,
        target: next ? `${userModule.currentYear + 1}` : undefined,
      })
      .then((_) => {
        this.handleCancel()
        this.$message.success('同步成功')
      })
      .finally(() => {
        loading()
        this.syncLoading = false
      })
  }

  public handlerSyncAllData() {
    if (!this.form.target_year) {
      this.$message.error('请选择年份')
      return
    }
    if (!this.form.target_task_id) {
      this.$message.error('请选择项目')
      return
    }
    const currentProject = this.projects.find(item => item.task_id === this.form.target_task_id)
    this.$confirm({
      title: '提示',
      content: `您确认从${this.form.target_year}年${currentProject?.task_nam}同步数据？`,
      onOk: () => {
        const loading = this.$message.loading({
          content: '数据正在同步中。。。请稍后',
        })
        this.syncLoading = true
        cropMemberServices
          .syncData({
            s_a_id: this.currentAreaId,
            target_task_id: this.form.target_task_id || '',
            target_year: this.form.target_year || '',
          })
          .then((_) => {
            this.handleCancel()
            this.$emit('syncSuccess')
            this.$message.success('同步成功')
          })
          .finally(() => {
            loading()
            this.syncLoading = false
          })
      },
    })
  }

  public handlerSyncFirstData(step: number, year?: number) {
    const loading = this.$message.loading({
      content: '数据正在同步中。。。请稍后',
    })
    this.syncLoading = true
    cropMemberServices
      .syncThisYearFirstData({
        s_a_id: this.currentAreaId,
        target:
          step === 1
            ? PROJECT_IDS.FIRST
            : step === 2
            ? PROJECT_IDS.SECOND
            : undefined,
      })
      .then((_) => {
        this.handleCancel()
        this.$message.success('同步成功')
      })
      .finally(() => {
        loading()
        this.syncLoading = false
      })
  }

  // 切换年份
  public handlerChangeYear(value: number, option: unknown) {
    const current = this.years.find((item) => item.label === value)
    this.projects = current ? current.value : []
  }
}
</script>

<style lang="less" scoped>
/deep/ .ant-radio-wrapper {
  display: block;
  margin-bottom: 5px;
}
</style>
